<!DOCTYPE html>
<html>

<head>
  <title>Juicer</title>
  <meta charset=UTF-8>
  <script type="text/javascript" src="../public/javascripts/jquery-easyui-1.4.4/jquery.min.js">
  </script>
  <script type="text/javascript" src="../public/javascripts/juicer.js"></script>
</head>

<body>

  <div id="hi">

  </div>
  <!--下面是模板-->

  <script id="tpl" type="text/template">
    <ul>
      {@each list as item}
      <li>${item._id}</li>
      {@/each}
    </ul>
  </script>
  <!--建立一个div来接收渲染结果-->
  <div id="result"></div>

  <script type="text/javascript">
    $.get('http://localhost:3004', function(datas) {
      // console.log(data[0]);
      var tpl = document.getElementById("tpl").innerHTML;

      // var datas = data[0];
      console.log(datas);

      var html = juicer(tpl, datas); //得到渲染结果，需要放到DOM元素中才能在页面中显示
      console.log(html);

      document.getElementById('hi').innerHTML = html;
    });
  </script>
</body>

</html>
